<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta charset="utf-8" />
  <title></title>
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <meta name="author" content="" />
  <link rel="stylesheet" href="css/main.css" />
  <link rel="stylesheet" href="enterpriseCommon/common.css">
  <!-- <link rel="stylesheet" href="css/main_1.css"> -->
  <!--[if lt IE 9]>
      <script src="js/html5shiv.min.js"></script>
      <script src="js/respond.min.js"></script>
    <![endif]-->
  <meta name="renderer" content="webkit" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" href="css/common.css" />
  <link rel="stylesheet" href="css/lcommon.css" />
  <script src="js/jquery.min.js"></script>
  <link href="js/um1.2.3/themes/default/css/umeditor.css?_ver=13" type="text/css" rel="stylesheet" />
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
  <script type="text/javascript" src="js/jquery.qqFace.js"></script>
  <script type="text/javascript" src="js/um1.2.3/umeditor.config.js?_ver=13"></script>
  <script type="text/javascript" src="js/um1.2.3/umeditor.js?_ver=13"></script>
  <script type="text/javascript" src="js/emotion.js"></script>
  <script src="js/lcommon.js"></script>
  <style>
    [v-cloak] {
      display: none;
    }

    .section51 .section-resume,
    .section51 .tab-box .resume-operate {
      display: block;
    }

    span.emotion {
      padding-left: 20px;
      cursor: pointer;
    }

    span.emotion:hover {
      background-position: 2px -28px;
    }

    .qqFace {
      margin-top: 4px;
      background: #fff;
      padding: 2px;
      border: 1px #dfe6f6 solid;
    }

    .qqFace table td {
      padding: 0px;
    }

    .qqFace table td img {
      cursor: pointer;
      border: 1px #fff solid;
    }

    .qqFace table td img:hover {
      border: 1px #0066cc solid;
    }

    .section51 .friends-list-operate,
    .section51 .bottom-box {
      z-index: 9;
    }
    a.item.on {
      color: #007AFF
    }
    .section51 .batch-operate-box {
      display: block;
      z-index: 9;
    }
  </style>
</head>

<body>
  <div id="app" v-cloak>
    <header id="header"></header>
    <div class="header-space"></div>

    <section class="section391">
      <div class="content">
        <div class="filter">
          <div class="item">
            <span class="tt">沟通岗位</span>
            <select v-model="jobId" @change="jobChangeHandle">
              <option v-for="(item) in jobList" :key="item.id" :value="item.id">{{item.name}}</option>
            </select>
          </div>
        </div>

        <ul class="tab-hd" v-show="jobId">

          <li v-for="(item, index) in tabList" :key="item.key" :class="{on: tabIndex === index}" @click="changeTab(index)"><a href="javascript:void(0)">{{item.name}}{{item.num>=0?'('+item.num+')':''}}</a></li>
          <!-- <li><a href="javascript:void(0)">新招呼（22)</a></li>
          <li><a href="javascript:void(0)">沟通中</a></li>
          <li><a href="javascript:void(0)">待接受（1)</a></li>
          <li><a href="javascript:void(0)">待面试（1)</a></li>
          <li><a href="javascript:void(0)">被拒绝（2)</a></li>
          <li><a href="javascript:void(0)">不合适（55)</a></li>
          <li><a href="javascript:void(0)">未录用（55)</a></li>
          <li><a href="javascript:void(0)">已录用（1)</a></li> -->
        </ul>
      </div>
    </section>

    <section class="section51">
      <div class="content w1100">
        <div class="message-box">
          <!-- message-box-left -->
          <div class="message-box-left">
            <div class="search-box">
              <input v-model="keywords" type="text" placeholder="输入姓名查找求职者" class="input" />
            </div>
            <div :class="{on: isShowCheck}" class="friends-list-operate">
              <label for="" :class="{on: isOnlyUnread}" class="checkbox" @click="changeOnlyUnread">只看未读</label>
              <a href="javascript:void(0)" class="btn-batch" @click="isShowCheck = true">批量操作</a>
              <a href="javascript:void(0)" class="btn-batch-cancle" @click="isShowCheck = false">取消</a>
            </div>
            <div :class="{on: isShowCheck}" class="friends-list scroll">
              <a href="javascript:void(0)" v-for="(item, index) in filterFriendsList" :class="{on: item.id == selectUid}" class="item" @click="selectChat(item)">
                <img :src="item.user_image.url || 'images/face.jpg'" alt="" class="face" />
                <h3>
                  {{item.name || '用户'}}
                  <time>{{item.created_at}}</time>
                </h3>
                <div class="txt" v-html="item.newinfo"></div>
                <label for="" :class="{on: checkMap[index]}" class="checkbox" @click.stop="changeCheckHandle(index)"></label>
                <span v-if="item.is_read_count" class="number" v-html="item.is_read_count"></span>
              </a>
            </div>
          </div>
          <!-- /message-box-left -->
          <!-- message-box-right -->
          <div class="message-box-right">
            <!-- 右侧切换 -->
            <div v-show="!isShowCheck" class="tab-box">
              <a href="javascript:void(0)" :class="{on: chatShowType == 0}" @click="changeChatShowType(0)" class="item">聊天</a><a href="javascript:void(0)" :class="{on: chatShowType == 1}" @click="changeChatShowType(1)" class="item">简历</a>
              <div v-show="chatShowType == 1" class="resume-operate">
                下载简历可查看联系方式
                <a href="javascript:void(0)" class="btn btn-white">下载简历</a><a href="javascript:void(0)" class="btn" @click="interviewHandle(0)">邀面试</a>
              </div>
            </div>
            <!-- 右侧聊天 -->
            <div v-show="!isShowCheck && chatShowType == 0" class="message">
              <div class="talk-box scroll mesScroll" @mousewheel="handleScroll">
                <div class="wrap mesWrap">
                  <template v-for="(item, index) in filterList">
                    <div v-if="diffTime(index)" class="time">
                      <time>{{diffTime(index)}}</time>
                    </div>
                    <div :class="[item.from_uid == selectUid?'item-left':'item-right']" class="item">
                      <div class="talk-face">
                        <img :src="(item.from_uid == selectUid? (selectData.user_image && selectData.user_image.url ) : myFace) || 'images/face.jpg' " alt="" />
                      </div>
                      <div :class="item.type|chatClassFilter" :style="item.type|chatStyleFilter" class="con">
                        <i class="talk-arrow"></i>
                        <template v-if="item.type == 1">
                          <p v-html="item.content"></p>
                        </template>
                        <template v-if="item.type == 2">
                          <a :href="'./30.html?id='+item.resume_id" class="face-link">
                            <img src="images/face.jpg" alt="" class="face" />
                            {{item.content}}
                          </a>
                        </template>
                        <template v-if="item.type == 3">
                          <div class="invate-txt">
                            向{{item.from_uid_info.name ||
                              '对方'}}发送了面试邀请
                          </div>
                        </template>
                        <template v-if="item.type == 4">
                          <div class="invate-txt">
                            {{item.from_uid_info.name || '您'}}取消了面试邀请
                          </div>
                        </template>
                        <template v-if="item.type == 5">
                          <div class="invate-txt">
                            【{{item.to_uid_info.name ||
                              '对方'}}】拒绝了您的面试邀请
                          </div>
                          <a style="color:#fff" class="link">已拒绝：{{item.content}}</a>
                        </template>
                        <template v-if="item.type == 6">
                          <div class="invate-txt">
                            【{{item.to_uid_info.name ||
                              '对方'}}】接受了您的面试邀请
                          </div>
                        </template>
                      </div>
                    </div>
                  </template>
                </div>
                <!-- <div class="top-msg">
							行政总监向您发送了面试邀请
							<a href="javascript:void(0)" class="btn">查看</a>
						</div> -->
              </div>

              <div class="bottom-box">
                <div class="hd">
                  <a href="javascript:void(0)" class="btn-face noFresh"><img class="emotion" src="images/icon-face.png" alt="" /></a>
                  <div class="right">
                    <a href="javascript:void(0)" class="btn btn-white" @click="unFitHandle(2)">不合适</a>
                    <a href="javascript:void(0)" class="btn btn-white">添加标签</a>
                    <a href="javascript:void(0)" class="btn btn-white">下载简历</a>
                    <a href="javascript:void(0)" class="btn" @click="interviewHandle(0)">邀面试</a>
                  </div>
                </div>

                <div class="inputContent">
                  <script style="width:792px !important;height:62px;z-index:10;" type="text/plain" id="myEditor"></script>
                  <div style="display: none;" class="input" id="saytext" name="saytext" contenteditable="true"></div>
                  <!-- <textarea name="" id="" cols="30" rows="10" v-model="content"></textarea> -->
                </div>
                <div class="operate">
                  <a href="javascript:void(0)" class="gray">按Enter建换行</a>
                  <div href="javascript:void(0)" class="btn" @click="sendText">发送</div>
                  <!-- <a href="javascript:void(0)" class="btn noData">发送</a> -->
                </div>
                <a href="javascript:void(0)" class="btn-report">
                  <img src="images/warn.png" alt="" />举报
                </a>
              </div>
            </div>
            <!-- 右侧简历 -->

            <section v-if="resumeData" v-show="!isShowCheck && chatShowType == 1" class="section-resume section393">
              <div class="tips-box">
                浏览招聘时间：5小时前
                <div class="right">
                  <a href="javascript:void(0)" class="btns" @click="collectHandle"><img :src="'images/hart'+(resumeData.is_collect?'-on': '')+'.png'" alt="" />{{resumeData.is_collect?'取消': ''}}收藏</a>
                  <a href="javascript:void(0)" class="btns"><img src="images/warn.png" alt="" />举报</a>
                </div>
              </div>
              <div class="resume-info">
                <div class="box">
                  <div class="left">
                    <div class="name">{{resumeData.person_info.name}}</div>
                    <ul class="list">
                      <li>
                        {{resumeData.person_info.sex | sexFilter}} |
                        {{resumeData.person_info.age}}岁 | {{resumeData.person_info.education}} |
                        {{resumeData.person_info.area}} | {{resumeData.resume_info.experience_config_id|experienceFilter}}年 | {{resumeData.resume_info.status_id|statusFilter}}
                      </li>
                      <li class="w50">
                        电话：{{resumeData.person_info.telephone}}
                      </li>
                      <li class="w50">
                        邮箱：{{resumeData.person_info.email}}
                      </li>
                      <li>语言：{{resumeData.person_info.language}}</li>
                    </ul>
                    <div class="tags">
                      <span v-for="(tagItem, tagIndex) in resumeData.person_info.person_tag" :key="tagIndex" class="tag tag-blue">{{tagItem.name}}</span>
                    </div>
                  </div>
                  <div class="right w200">
                    <div class="face">
                      <a href="javascript:void(0)"><img :src="resumeData.person_info.image" alt="" /></a>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box1">
                <div class="title-line">简历摘要</div>
                <div class="list-works-simple">
                  <div v-for="(workItem, workIndex) in resumeData.work_experience" :key="workIndex" class="item">
                    <div class="name">{{ workItem.name }}</div>
                    <div class="tags">
                      <span v-for="(tagItem, tagIndex) in workItem.trade" :key="tagIndex">{{tagItem}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box1">
                <div class="title-line">求职意向</div>
                <ul class="list">
                  <li class="w50">
                    期望职位：{{resumeData.resume_info.position}}
                  </li>
                  <li class="w50">
                    工作性质：{{resumeData.resume_info.nature}}
                  </li>
                  <li class="w50">
                    工作地点：{{resumeData.resume_info.area}}
                  </li>
                  <li class="w50">
                    期望薪资：{{resumeData.resume_info.salary_min}}~{{resumeData.resume_info.salary_max}}
                  </li>
                </ul>
              </div>
              <div class="resume-box resume-box2">
                <div class="title-line">工作经验</div>
                <div class="list-works">
                  <div v-for="(workItem, workIndex) in resumeData.work_experience" :key="workIndex" class="item">
                    <div class="title-small">
                      <span class="name">{{ workItem.name }}</span><small>{{
                          workItem.start}}～{{workItem.end}}（{{workItem.time}}年）</small>
                    </div>
                    <div class="sub-title">
                      <span>{{ workItem.position }}</span>|<span>税前{{ workItem.salary }}</span>
                    </div>
                    <div class="con">
                      {{workItem.desc}}
                    </div>
                    <div class="tags">
                      <span v-for="(tagItem, tagIndex) in workItem.trade" :key="tagIndex" class="tag tag-gray">{{tagItem}}</span>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box3">
                <div class="title-line">教育经历</div>
                <div class="list-teach">
                  <div v-for="(educationItem, educationIndex) in resumeData.education_experience" :key="educationIndex" class="item">
                    <div class="title-small">
                      <span class="name">{{educationItem.name}}</span><small>{{educationItem.start}}～{{educationItem.end}}（{{educationItem.time}}年）</small>
                    </div>
                    <div class="sub-title">
                      <span>{{educationItem.major}}</span>|<span>{{educationItem.education}}</span>
                    </div>
                    <div class="con">
                      <p>{{educationItem.desc}}</p>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box4">
                <div class="title-line">学历认证</div>
                <div class="list-card">
                  <div class="item">
                    <div class="img-box">
                      <div class="img">
                        <img :src="resumeData.education_certificate[0]" alt="" class="cover" />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box5">
                <div class="title-line">个人作品</div>
                <div class="list-product">
                  <div class="item">
                    <div class="img-box-more">
                      <div v-for="(workImgItem, workImgIndex) in resumeData.person_works" :key="workImgIndex" class="img">
                        <img :src="workImgItem" alt="" class="cover" />
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="resume-box resume-box6">
                <div class="title-line">自我评价</div>
                <div class="list-info">
                  <div class="item">
                    <div class="con">
                      {{resumeData.person_desc}}
                    </div>
                  </div>
                </div>
              </div>
            </section>

            <!-- 右侧批量操作 -->
            <div v-show="isShowCheck" class="batch-operate-box">
              <img src="images/img391.png" alt="" class="icon" />
              <div class="txt">已勾选{{checkCount}}人</div>
              <div class="operate">
                <a href="javascript:void(0)" class="btn btn-white" @click="readCheckHandle">已读</a>
                <a href="javascript:void(0)" class="btn" @click="unFitCheckHandle">不合适</a>
              </div>
            </div>
          </div>
          <!-- /message-box-right -->
        </div>
      </div>
    </section>

    <!-- 去掉样式show即可默认不显示 -->
    <div v-show="isShowSysMsg" class="alert alert-systemMsg">
      <div class="over-close" @click="closeMes"></div>
      <div class="boxRb">
        <div class="title">消息</div>
        <div class="list scroll">
          <div v-for="(item, index) in sysMsgList" :key="item.id">
            <div class="time" v-html="item.created_at"></div>
            <div v-if="item.type == 1" class="item">
              <h3><a href="javascript:void(0)">消息标题</a></h3>
              <div :class="{on: item.isShow}" class="con">
                {{item.content}}
                <a href="javascript:void(0)" :class="{on: item.isShow}" class="btn-more" @click="item.isShow = !item.isShow">{{item.isShow? '收起':'展开'}}</a>
              </div>
            </div>

            <div v-if="item.type == 2" class="item">
              <h3><a href="javascript:void(0)">简历推荐</a></h3>
              <div class="con on">
                平台向您推荐了
                {{item.from_uid_info.name}}的简历，点击查看简历详情
                <a :href="'./30.html?id='+ item.from_uid_info.resume_id" class="arrow">简历详情</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <pop-reason v-if="isShowReason" :id="editId" :type="editType" @cancel="cancelHandle" @sure="unFitSureHandle"></pop-reason>
    <pop-interview v-if="isShowIterview" :id="editId" :type="editType" :uid="editUid" @cancel="cancelHandle" @sure="interviewSureHandle"></pop-interview>

    <footer id="footer"></footer>
  </div>

  <script src="https://cdn.bootcss.com/socket.io/2.3.0/socket.io.js"></script>
  <script src="js/slide.min.js"></script>
  <script src="js/polyfill.min.js"></script>
  <script src="js/jquery.nicescroll3.7.6.min.js"></script>
  <!-- <script src="js/main.js"></script> -->
  <script src="js/vue.js"></script>
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <script src="js/moment.min.js"></script>
  <script src="js/request.js"></script>
  <script src="js/getPrepareData.js"></script>
  <script src="js/popComponents.js"></script>
  <script>
    $(function() {
      $("header").load("./enterpriseCommon/header.html");
      $("footer").load("./enterpriseCommon/footer.html");
      
    })

  </script>
  <script>
    function getTime(item) {
      var startStr = item.start;
      var endStr = item.end;
      var startDate = new Date(/\d/.test(startStr) ? startStr : Date.now());
      var endDate = new Date(/\d/.test(endStr) ? endStr : Date.now());
      var year = endDate.getFullYear() - startDate.getFullYear();
      var month = endDate.getMonth() - startDate.getMonth();
      var btYear = Math.round(month / 6) * 0.5;
      return year + btYear;
    }

    function getUrlParams(url) {
      url = url || location.href;
      url = url.replace("#!/", "");
      if (
        url.lastIndexOf("?") === -1 ||
        url.lastIndexOf("?") === url.length - 1
      )
        return {};
      var search = url.split("?")[1].split("&");
      var params = {};
      for (var i in search) {
        if (!!search[i]) {
          var _temp = search[i].split("=");
          params[_temp[0]] = _temp[1];
        }
      }
      return params;
    }
    // 聊天记录窗口大小改变，以及是否滚动到底部
    function scrollResize(isScrollBottom) {
      var scrollEl = $(".mesScroll");
      scrollEl.getNiceScroll().resize()
      if (isScrollBottom) scrollEl.getNiceScroll(0).doScrollTop(9999999, 0)
    }
    var token = getToken().substring(7);
    const socket = io("http://zhaopin-api.weihankeji.com:9501", {
      transports: ["websocket"],
      reconnection: true,
      query: {
        token: token
      }
    });

    function connectIm(start) {
      if (!start) {
        return;
      }
      socket.on("chat:tip", function(res1) {
        // console.log('用户未读条数监听事件')
        // console.log(res1)
      }); //用户未读条数监听事件

      socket.on("chat:info", function(res2) {
        _vm.list.push(res2);
        if (_vm.mesList.length) {
          var isHas = _vm.mesList.some(function(item) {
            return item.id == res2.from_uid;
          });
          if (!isHas) {
            // _vm.mesList.push(res2)
            _vm.initData();
          }
        } else {
          _vm.initData();
          // _vm.mesList.push(res2)
        }
      }); //用户信息监听事件
    }
    
    $("body").on('click', '.newMessage', function() {
      _vm.showSysMsg();
    });
    var _vm = new Vue({
      el: "#app",

      data: {
        userInfo: {},
        keywords: "", // 查找用户时输入的关键字
        content: "",
        selectUid: getUrlParams().id || "", // 当前聊天对象的uid
        list: [], // 收到的所有聊天的聊天列表，需要过滤
        filterList: [], // 当前聊天的聊天列表
        resumeData: null, // 当前聊天用户的简历
        mesList: [], // 所有聊天列表，
        page: 1, // 聊天记录的页面
        last_page: "", // 聊天记录的最后一页
        sysMsgList: [], // 新消息记录
        selectData: {}, // 当前选中聊天的对象
        chatShowType: 0, // 显示聊天还是简历， 0：聊天 1：简历
        checkMap: {}, // 选中映射
        jobList: [], // 岗位列表
        tabList: [{
            id: 0,
            name: '全部',
            key: 'goutongzhong',
            num: 0
          }, {
            id: 1,
            name: '新招呼',
            key: 'xinzhaohu',
            num: 0
          },
          // {
          //   id: 1,
          //   name: '沟通中',
          //   key: 'goutongzhong',
          //   num: 0
          // }, 
          {
            id: 6,
            name: '待接受',
            key: 'daijieshou',
            num: 0
          }, {
            id: 7,
            name: '待面试',
            key: 'daimianshi',
            num: 0
          }, {
            id: 8,
            name: '被拒绝',
            key: 'beijujue',
            num: 0
          }, {
            id: 3,
            name: '不合适',
            key: 'buheshi',
            num: 0
          }, {
            id: 5,
            name: '未录用',
            key: 'weiluyong',
            num: 0
          }, {
            id: 4,
            name: '已录用',
            key: 'yiluyong',
            num: 0
          }
        ],
        tabIndex: 0,
        jobId: 0,
        isOnlyUnread: false, // 是否只看未读
        isShowCheck: false, // 是否显示批量操作
        isShowSysMsg: false, // 是否显示系统消息

        isShowReason: false,
        isShowIterview: false,
        editType: 1, // 1添加 ，取消面试
        editId: 0, // 编辑等操作时的id
        editUid: 0 // 编辑等操作是用户的id
      },
      computed: {
        myuid: {
          get: function() {
            return this.userInfo.uid
          },
          set: function(val) {
            this.$set(this.userInfo, 'uid', val)
          }
        },
        myFace: function() {
          return this.userInfo.logo
        },
        currentTab: function() {
          return this.tabList[this.tabIndex]
        },
        filterFriendsList: function() {
          var list = this.mesList;
          var keywords = this.keywords;
          var isOnlyUnread = this.isOnlyUnread;
          return list.filter(function(item) {
            var isIncludeKeywords = item.name && ~item.name.indexOf(keywords);
            return (
              (isOnlyUnread ? item.is_read_count : true) && isIncludeKeywords
            );
          });
        },
        checkedIndexList: function() {
          var checkMap = this.checkMap;
          return Object.keys(checkMap).filter(function(count, key) {
            return checkMap[key]
          })
        },
        checkCount: function() {
          return this.checkedIndexList.length
        }
      },
      watch: {
        list: function() {
          var that = this;
          var list = this.list;
          var myuid = this.myuid;
          var selectUid = this.selectUid;
          if (list.length) {
            var filterList = list.filter(function(item) {
              var fromUid = item.from_uid_info.id;
              var toUid = item.to_uid_info.id;
              return (
                (fromUid === selectUid && toUid === myuid) ||
                (toUid === selectUid && fromUid === myuid)
              );
            });
            this.filterList.push.apply(this.filterList, filterList);
            setTimeout(function() {
              scrollResize(true)
            }, 10);
          }
        }
      },
      created: function() {
        var self = this;
        prepare.getEnterPriseResumeData(function() {
          self.getUserID();
          self.initData(true);
          self.getJobList();
          self.getRecruitCount();
        });
      },
      mounted: function() {
        var that = this;
        $(".scroll").niceScroll({
          cursorcolor: "#eee",
          cursorwidth: "8px",
          cursorborder: ""
        });
        var a = $(".mesScroll").niceScroll(".mesWrap", {
          cursorcolor: "#eee",
          cursorwidth: "8px",
          cursorborder: "",
          scrollspeed: 60,
          preventmultitouchscrolling: true // 防止多触点事件引发滚动
        });
        a.scrollend(function(e, e1) {
          if (e.end.y == 0) {
            that.handleScroll();
          }
        });
      },
      methods: {
        // 获取当前登录账户的uid
        getUserID: function() {
          var self = this;
          request(
            "enterprise/company/employee_base_info",
            "GET",
            "",
            function(res) {
              self.userInfo = res.data
            },
            function(err) {
              self.$message.error(err.message);
            }
          );
        },
        // 获取岗位列表
        getJobList: function(callback) {
          var self = this;
          request('chat/job-list', 'GET', '', function(res) {
            var data = res.data;
            self.jobList = Object.keys(data).map(function(id) {
              return {
                id: id,
                name: data[id]
              }
            });
            self.jobList.unshift({
              id: 0,
              name: '全部'
            })
            self.jobId = 0;
            typeof callback == 'function' && callback()
          })
        },
        // 获取岗位对应的统计
        getRecruitCount: function() {
          var self = this;
          var tabList = this.tabList;
          if (!this.jobId) return;
          request('chat/recruit-count', 'GET', {
            recruit_id: this.jobId
          }, function(res) {
            var data = res.data;
            tabList.forEach(function(tabItem) {
              var key = tabItem.key;
              tabItem.num = data[key] || 0
            })
            self.tabIndex = 0;
          })
        },
        jobChangeHandle: function() {
          this.getRecruitCount()
          this.filterList = []
          this.selectUid = ''
          this.initData(true)
        },
        changeTab: function(index) {
          if (this.tabIndex === index) return
          if (!this.jobId) {
            return this.$message('请先选择具体岗位')
          }
          this.selectUid = '';
          this.tabIndex = index;
          this.initData();
        },
        // 获取左侧聊天人员列表
        initData: function(start) {
          var that = this;
          var jobId = this.jobId;
          var tabId = this.currentTab.id;
          if (jobId) {
            request('chat/recruit-users', 'GET', {
              recruit_id: jobId,
              type: tabId
            }, success.bind(this), fail.bind(this))
          } else {
            request(
              "chat/boot-data",
              "get",
              "",
              success.bind(this),
              fail.bind(this)
            );
          }

          function success(res) {
            var mesList = res.data;
            var selectUid = that.selectUid

            that.mesList = mesList;
            connectIm(start);
            var checkMap = {};
            var noReadNumber = mesList.reduce(function(
                num,
                item,
                index
              ) {
                checkMap[index] = false;
                return num + Number(item.is_read_count);
              },
              0);

            this.checkMap = checkMap;
            if (start) {

              var has;
              if (selectUid) {
                mesList.forEach(v => {
                  if (v.id == selectUid) {
                    has = v;
                  }
                });
                if (!has) {
                  var d = moment().format("YYYY-MM-DD HH:mm:ss");
                  has = {
                    "id": selectUid,
                    "account": "",
                    "name": " ",
                    "telephone": "",
                    "sex": 0,
                    "birthday": "",
                    "area_id": 1,
                    "email": "",
                    "id_card": "",
                    "desc": "",
                    "created_at": d,
                    "updated_at": d,
                    "login_time": d,
                    "login_ip": null,
                    "nickname": "",
                    "status": 0,
                    "school_name": null,
                    "education_id": 0,
                    "position_id": 0,
                    "status_id": 0,
                    "registration_id": null,
                    "en_desc": null,
                    "en_name": "",
                    "en_nickname": null,
                    "en_sex": 0,
                    "en_birthday": "",
                    "en_email": "",
                    "en_id_card": "",
                    "en_area_id": 1,
                    "en_telephone": "",
                    "is_read_count": 0,
                    "user_image": "",
                    "newinfo": ""
                  };
                  checkMap[Object.keys(checkMap).length] = false;
                  that.mesList.unshift(has);
                }
              } else {
                has = mesList[0]
              }
              if (has) {
                that.selectChat(has);
              }
              // 设置header部分的事件
              setTimeout(function() {
                // 打开系统消息
                var $number = $("header .number");
                $number.text(noReadNumber);
                if (noReadNumber == 0) {
                  $number.hide();
                } else {
                  $number.show();
                }
              }, 50);
            }

            // that.$message.success(res.message);
          }

          function fail(err) {
            that.$message({
              message: err.responseJSON.message,
              type: "error"
              // duration: 0
            });
          }
        },
        //获取历史聊天记录
        getHistory: function() {
          var that = this,
            params = {
              heruid: this.selectUid,
              page: this.page
            };
          request(
            "chat/chat-list",
            "get",
            params,
            function(res) {

              that.myuid = res.data.myuid;
              that.last_page = res.data.last_page;
              if (that.page === 1) {
                that.filterList = res.data.data;
              } else {
                that.filterList = res.data.data.concat(that.filterList);
              }
              that.$forceUpdate();
              setTimeout(function() {
                scrollResize(that.page == 1)
              }, 50);
              // $(".scroll").getNiceScroll().eq(1).resize()
            },
            function(err) {
              that.$message.error(err.message);
            }
          );
        },

        //滚动到顶部
        handleScroll(e) {
          var that = this;
          this.$nextTick(function() {
            if (that.page == that.last_page) {
              return false;
            }
            that.page++;
            that.getHistory();
          });
        },
        // 打开新消息窗口
        showSysMsg: function() {
          var that = this;
          request(
            "chat/main-list",
            "get",
            "",
            function(res) {
              var list = res.data;
              if (list.length) {
                that.isShowSysMsg = true;
              } else {
                that.$message.warning("暂时没有新的消息");
              }
              list.forEach(function(item) {
                item.isShow = false;
              });
              that.sysMsgList = list;
            },
            function(err) {
              that.$message.error(err.message);
            }
          );
        },
        closeMes: function() {
          this.isShowSysMsg = false;
        },
        //选中某个聊天
        selectChat: function(val) {
          this.selectData = val;
          this.selectUid = val.id;
          this.list = [];
          this.filterList = [];
          this.page = 1;
          this.getHistory();
          this.changeChatShowType(0);
          this.resumeData = null;
          // 判断是否有未读消息
          if (val.is_read_count) {
            this.setRead(val);
          }
        },
        setRead: function(val) {
          var that = this;
          request(
            "chat/set-read",
            "post",
            JSON.stringify({
              heruid: val.id
            }),
            function(res) {
              // that.initData()
              val.is_read_count = 0;
              // that.$message.success(res.message);
            },
            function(err) {
              that.$message.error(err.message);
            }
          );
        },
        changeChatShowType: function(type) {
          if (this.chatShowType === type) return;
          switch (type) {
            case 0: {
              // 聊天窗口
              break;
            }
            case 1: {
              // 简历
              if (!this.resumeData) {
                var self = this;
                this.getResumeData(function() {
                  self.chatShowType = type;
                });
                return;
              }
            }
          }
          this.chatShowType = type;
        },
        // 设置是否未读
        changeOnlyUnread: function() {
          this.isOnlyUnread = !this.isOnlyUnread;
        },
        // 切换单项选中
        changeCheckHandle: function(index) {
          var checkMap = this.checkMap;
          checkMap[index] = !checkMap[index];
        },
        // 获取简历信息
        getResumeData(callback) {
          var id = this.selectUid;
          if (!id && id !== 0) {
            return this.$message("暂无简历");
          }
          request(
            "enterprise/index/user_recruit/" + id,
            "GET",
            "",
            success.bind(this),
            fail.bind(this)
          );

          function success(res) {
            var data = res.data;
            var resumeData = (this.resumeData = {});
            resumeData.person_info = data.person_info;
            resumeData.resume_info = data.resume_info;
            resumeData.work_experience = data.work_experience;
            resumeData.education_experience = data.education_experience;
            resumeData.education_certificate = data.education_certificate;
            resumeData.person_works = data.person_works;
            resumeData.person_desc = data.person_desc;
            resumeData.resume_type = data.resume_type;
            this.filterData(callback);
          }

          function fail(err) {
            this.$message("获取简历失败");
          }
        },
        // 过滤简历
        filterData(callback) {
          var resumeData = this.resumeData;
          // 根据id查找数据
          var personInfo = resumeData.person_info;
          var resumeInfo = resumeData.resume_info;
          var workExperience = resumeData.work_experience;
          var educationExperience = resumeData.education_experience;
          personInfo.area = prepare
            .getRegionNameList(personInfo.area_id)
            .slice(-1)[0];
          personInfo.language = personInfo.language.reduce(function(
              result,
              item
            ) {
              result +=
                prepare.getLanguageName(item.language_id) +
                "|" +
                prepare.getAbilityName(item.ability_id);
              return result;
            },
            "");
          personInfo.person_tag.forEach(function(item) {
            item.name = prepare.getTagName(item.tag_id);
          });

          resumeInfo.nature = prepare.getNatureName(resumeInfo.nature_id);
          resumeInfo.position = prepare
            .getPositionNameList(resumeInfo.position_id)
            .join("-");
          resumeInfo.area = prepare
            .getRegionNameList(resumeInfo.area_id)
            .join("-");

          workExperience.forEach(function(item) {
            // item.position = prepare.getPositionNameList(item.position_id).join('-')
            item.time = getTime(item);
            item.trade = prepare.getTradeNameList(item.trade_id);
          });

          educationExperience.forEach(function(item) {
            item.education = prepare.getEducationName(item.education_id);
            item.time = getTime(item);
          });
          typeof callback === "function" && callback();
        },
        // 不合适,取消面试
        unFitHandle: function(type) {
          var item = this.selectData;
          this.isShowReason = true;
          this.editType = type;
          this.editId = item.id;
        },
        // 邀请面试，编辑面试
        interviewHandle: function(type) {
          var item = this.selectData;
          this.isShowIterview = true;
          this.editType = type;
          this.editUid = item.user_image.uid;

          this.editId = 0;
        },
        unFitSureHandle: function(res) {
          // 预留，等待相关接口
          this.cancelHandle()
        },
        interviewSureHandle: function(res) {
          socket.emit("chat", {
            to_uid: this.selectUid,
            content: '发送面试邀请',
            type: "3",
            interview_id: res.data.interview_id
          });
          this.cancelHandle()
        },
        cancelHandle: function() {
          this.isShowIterview = this.isShowReason = false;
        },
        // 收藏
        collectHandle: function() {
          var item = this.resumeData;
          request('enterprise/resume/collect', item.is_collect ? 'DELETE' : 'POST', JSON.stringify({
            user_id: item.uid
          }), success.bind(this))

          function success(res) {
            this.$message.success(res.message)
            this.$set(item, 'is_collect', !item.is_collect)
          }
        },
        // 设置选中已读
        readCheckHandle: function() {
          var checkCount = this.checkCount;
          var checkedIndexList = this.checkedIndexList;
          var filterFriendsList = this.filterFriendsList;
          var self = this;

          if (!checkCount) return;

          request('chat/batch-deal', 'POST', JSON.stringify({
            type: 1,
            uidlist: checkedIndexList.map(function(index) {
              return filterFriendsList[index].id
            })
          }), function(res) {
            self.$message.success("操作成功")
            checkedIndexList.forEach(function(index) {
              filterFriendsList[index].is_read_count = 0;
            })
          }, function(err) {
            self.$message({
              message: err.responseJSON ? err.responseJSON.message : err,
              type: "error"
            });
          })
        },
        unFitCheckHandle: function() {
          var checkCount = this.checkCount;
          var checkMap = this.checkMap;
          var checkedIndexList = this.checkedIndexList;
          var filterFriendsList = this.filterFriendsList;
          var self = this;
          if (!checkCount) return;
          request('chat/batch-deal', 'POST', JSON.stringify({
            type: 2,
            uidlist: checkedIndexList.map(function(index) {
              return filterFriendsList[index].id
            })
          }), function(res) {
            self.$message.success("操作成功")
          }, function(err) {
            self.$message({
              message: err.responseJSON ? err.responseJSON.message : err,
              type: "error"
            });
          })
          // this.isShowReason = true;
          // this.editType = 2;
          // this.editId = Object.keys(checkMap)
          //   .filter(function(key) {
          //     return checkMap[key];
          //   })
          //   .map(function(key) {
          //     var item = filterFriendsList[key];
          //     return item.id;
          //   });

          // var self = this;
          // this.$prompt('请输入不合适原因', '提示', {
          //   confirmButtonText: '确定',
          //   cancelButtonText: '取消',
          // }).then(function(_) {
          //   var reason = _.value;

          //   Object.keys(checkMap).forEach(function(key) {
          //     var item = filterFriendsList[key]
          //     if (checkMap[key]) {
          //       request('enterprise/user_recruit/' + item.id, 'PUT', JSON.stringify({
          //         status: 3,
          //         reason: reason
          //       }))
          //     }
          //   }, self)
          // }).catch(function(err) {

          // });
        },

        //时间差
        diffTime: function(index) {
          var filterList = this.filterList;
          var diff;
          if (index == 0) {
            return filterList[index].created_at;
          } else {
            var a = moment(filterList[index - 1].created_at);
            var b = moment(filterList[index].created_at);
            diff = Math.abs(b.diff(a, "minutes")); // 1
            if (diff > 1) {
              return filterList[index].created_at;
            } else {
              return "";
            }
          }
        },
        //发送消息
        sendText: function() {
          var content = um.getContent();
          var selectUid = this.selectUid;
          var myuid = this.myuid;
          if (!content) {
            this.$message.success("发送内容不能为空");
            return false;
          }
          socket.emit("chat", {
            to_uid: selectUid,
            content: content,
            type: "1"
          });
          // var d = moment().format("YYYY-MM-DD HH:mm:ss");
          // this.filterList.push({
          //   content: content,
          //   created_at: d,
          //   from_uid: myuid,
          //   from_uid_info: {
          //     id: myuid
          //   },
          //   id: 99999,
          //   is_read: 1,
          //   to_uid: selectUid,
          //   to_uid_info: {
          //     id: selectUid
          //   },
          //   type: 1,
          //   updated_at: d,
          //   userlist: selectUid + "" + myuid
          // });

          um.setContent("", false);
        }
      },
      filters: {
        sexFilter: function(sex) {
          return ["女", "男"][sex];
        },
        experienceFilter: function(id) {
          return prepare.getExperienceName(id)
        },
        statusFilter: function(id) {
          return prepare.getStatusName(id)
        },
        chatClassFilter: function(type) {
          var map = {
            3: 'invate',
            4: 'invate',
            5: 'invate',
            6: 'invate',
          };
          return map[type] || ''
        },
        chatStyleFilter: function(type) {
          return +type === 6 ? 'background-color: #F8F9FC;color:#333;' : ''
        }
      }
    });

  </script>
</body>

</html>
